<template>
  <view class="scores">
    <view class="headss">
      <view class="score">7907</view>
      <view class="add">
        <text class="line"> </text>
        <view> 累计积分 </view>
        <text class="line"> </text>
      </view>
    </view>
    <view class="content">
      <view class="txt"> 本月获取 <text>320 </text>积分 </view>
      <view class="list">
        <view> <view> 黄金购买积分 </view> <view class="red"> +2 </view></view>
        <view class="time"> <view> 2021-3-31 18:32</view> <view> 查看 </view></view>
        <view class="line"></view>
      </view>
      <view class="list">
        <view> <view> 黄金购买积分 </view> <view> +2 </view></view>
        <view> <view> 2021-3-31 18:32</view> <view> 查看 </view></view>
        <view class="line"></view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {},
};
</script>


<style lang="scss" scoped>
.scores {
  background-color: #fafafa;
  position: absolute;
  width: 100vw;
  .headss {
    color: #ffffff;
    width: 100%;
    height: 400rpx;
    background-color: #ff4558;
    border-radius: 0px 0px 30% 30%;
    padding-top: 30rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    .score {
      font-size: 80rpx;
      font-weight: bold;
      padding: 20rpx;
    }
    .add {
      display: flex;

      .line {
        border-bottom: 1rpx solid #e7e1e1;
        height: 20rpx;
        width: 160rpx;
      }
      view {
        padding: 0 20rpx;
        font-size: 24rpx;
      }
    }
  }
  .content {
    border: 1px solid red;
    background-color: #ffffff;
    font-size: 36rpx;
    padding: 24rpx;
	margin: 30rpx;
	border-radius: 24rpx;
    .txt {
      font-weight: bold;
      text {
        color: red;
      }
    }
    .list {
      padding-top: 20rpx;
      display: flex;
      flex-direction: column;
      .red {
        color: red;
      }
	  .time{
		  font-size: 24rpx;color: #808080;
	  }
      > view {
        display: flex;
        justify-content: space-between;
		padding: 10rpx 0 ;
      }
      .line {
        border-top: 2rpx solid black;
        padding-top: 10rpx;
      }
    }
  }
}
</style>
